<template>
  <CategorySelector :disabled="!isShowAttrList" />
  <AttrList
    v-if="isShowAttrList"
    @setIsShowAttrList="isShowAttrList = $event"
    @setAttr="attr = $event"
  />
  <SaveOrUpdateAttr v-else @setIsShowAttrList="isShowAttrList = $event" :current-attr="attr" />
</template>
<script lang="ts" setup>
  import { ref, reactive } from 'vue';
  import { Attr } from '/@/api/product/model/attrModel';
  import AttrList from './components/AttrList.vue';
  import SaveOrUpdateAttr from './components/SaveOrUpdateAttr.vue';

  const isShowAttrList = ref(true);
  const attr = reactive<Attr>({
    attrName: '',
    attrValueList: [],
  });
</script>
